<template>
	<view class="order">
		<!-- <view class="background-white ph-32 h-80">
        <view class="w-f h-60 search">
            <u-search
                placeholder="快速查找戳我"
                v-model="keyword"
                height="30"
                bgColor="#F5F5F5"
                searchIconColor="#999"
                placeholderColor="#999"
                clearabled
                :showAction="false"
            >
            </u-search>
            <view class="w-100 search-btn"><u-button text="搜索" color="#FABB3C" shape="circle" @click.stop="toSearch"></u-button></view>
        </view>
    </view> -->
		<scroll-view scroll-y="true" :style="{ height: height - 40 + 'px' }" :refresher-enabled="isOpenRefresh"
			:refresher-triggered="triggered" @refresherpulling="onPulling" @refresherrefresh="onRefresh"
			@scrolltolower="scrolltolower">
			<view class="mt-20 background-white ph-32 pv-32" @click="toDetail(item)" v-for="(item, index) in list"
				:key="index">
				<view class="f ai-c jc-s-b">
					<view class="fs-24 text-color3" v-if="item.orderId">订单编号：{{ item.orderId }}</view>
					<view v-else></view>
					<view class="fs-24" :style="{ color: statusLists[item.status].color }">
						<text>{{statusLists[item.status].name}}</text>
					</view>
				</view>
				<view class="f mt-32">
					<image :src="item.picUrl" class="w-160 h-160 b-12 mr-20"></image>
					<view class="f ai-c f1">
						<view class="f f1 mr-24 fd-c">
							<view class="fs-28 fw-600 text-color4"> {{ item.activityName }}</view>
							<view class="fs-24 text-color7">当前价格：¥{{ item.bargainPrice}}</view>
						</view>

					</view>
				</view>
				<view class="f ai-c jc-s-b" style="border-top: 1px solid #f5f5f5;
		padding-top: 20rpx;">
					<view class="time">活动结束时间：{{item.endTime}}</view>
					<view class="w-152 h-64 b-64 f ai-c jc-c fs-26 text-color border2 ml-16" v-if="item.status == 1" @click="toShare(item)">邀请好友
					</view>
					<view class="w-152 h-64 b-64 f ai-c jc-c fs-26 text-color border2 ml-16" v-else>查看详情
					</view>
				</view>
			</view>
		</scroll-view>
	</view>
</template>
<script setup lang="ts">
	import { ref } from 'vue';
	import { onLoad } from '@dcloudio/uni-app';
	import { bargainpage } from '@/services/api/shop/index';
	import { formatTimestamp } from '@/services/api/index/index';
	import { useAuthStore } from '@/store/modules/auth';
	const list = ref<any[]>([]);
	const listParams = ref<any>({
		pageNo: 1,
		pageSize: 10,
		status: '',
	});
	const isOpenRefresh = ref(true);
	const triggered = ref(false);
	const statusLists = {
		'1': { name: '砍价中', color: '#FE8C29' },
		'2': { name: '砍价成功', color: '#25B85B' },
		'3': { name: '砍价失败', color: '#999999' },
		
	};
	onLoad(async (option : any) => {

		getList();
	});


	function toShare(item){
		uni.navigateTo({
			url:'/pages_mine/orderBargain?id='+item.id+'&activityId='+item.activityId
		})
	}
	//下拉刷新
	function onPulling(e : any) {
		if (e.detail.deltaY < 0) return;
		triggered.value = true;
	}

	function onRefresh() {
		triggered.value = false;
		list.value = [];
		listParams.value.pageNo = 1;
		getList();
	}

	//上拉加载
	function scrolltolower() {
		listParams.value.pageNo++;
		getList();
	}



	

	async function getList() {
		const { data } = await bargainpage(listParams.value);
		data.list.forEach((item : any) => {

			if (item.endTime) {

				item.endTime = formatTimestamp(item.endTime);
			}

		});
		list.value = list.value.concat(data.list);
	}

	function toDetail(data : any) {
		uni.navigateTo({
			url: `/pages_mine/orderDetail?id=${data.id}`,
		});
	}




	let systemInfo = uni.getSystemInfoSync();
	const statusBarHeight = systemInfo.statusBarHeight;
	let pageHeight = systemInfo.windowHeight;
	const height = pageHeight - statusBarHeight - 46;
</script>
<style lang="scss" scoped>
	.time {
		
		font-size: 24rpx;
		
		color:#777;
	}

	.order {
		background: #f5f5f5;
		min-height: 100vh;

		.border2 {
			border: 1rpx solid #fabb3c;
		}

		.border {
			border: 1rpx solid #dddddd;
		}

		.search {
			position: relative;

			.search-btn {
				position: absolute;
				right: 6rpx;
				top: 6rpx;
				z-index: 11;
			}

			::v-deep .u-button__text {
				font-size: 22rpx !important;
				font-weight: 400 !important;
			}

			::v-deep .u-button {
				height: 48rpx !important;
			}
		}

		.background-white {
			background: #fff;
		}
	}
</style>